<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
  <th:block th:include="include :: header('项目日志列表')"/>
</head>
<body class="gray-bg">
<div class="container-div">
  <form class="form-horizontal m" id="form-projectLog-edit" th:object="${projectInfo}">
    <input id="projectId" name="projectId" th:field="*{projectId}"  type="hidden">
  </form>
  <div class="row">
    <div class="col-sm-12 search-collapse">
      <form id="formId">
        <div class="select-list">
          <ul>
            <li>
              姓名：<input type="text" name="userName"/>
            </li>
            <li>
              <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
              <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
            </li>
          </ul>
        </div>
      </form>
    </div>
    <div class="btn-group-sm" id="toolbar" role="group">
      <a class="btn btn-danger btn-del disabled" onclick="$.operate.removeAll()"
         shiro:hasPermission="project:projectLog:remove">
        <i class="fa fa-remove"></i> 删除
      </a>
      <a class="btn btn-warning" onclick="$.table.exportExcel()"
         shiro:hasPermission="project:projectLog:edit">
        <i class="fa fa-download"></i> 导出
      </a>
      <a class="btn btn-info" onclick="uploadData()"
         shiro:hasPermission="project:projectLog:edit">
        <i class="fa fa-upload"></i> 导入
      </a>
<!--      <a class="btn btn-info" onclick="$.table.importTemplate()"-->
<!--             shiro:hasPermission="project:projectLog:edit">-->
<!--      <i class="fa fa-upload"></i> 下载模板-->
    </a>
<!--      <a class="btn btn-info" onclick="downloadTp('service.log.tp')"-->
<!--         shiro:hasPermission="project:projectLog:edit">-->
<!--        <i class="fa fa-download"></i> 模板下载-->
<!--      </a>-->
    </div>
    <div class="col-sm-12 select-table table-striped">
      <table id="bootstrap-table" data-mobile-responsive="true"></table>
    </div>
  </div>
</div>

<div th:include="include :: footer"></div>
<script th:inline="javascript">
  var editFlag = [[${@permission.hasPermi('project:projectLog:edit')}]];
  var removeFlag = [[${@permission.hasPermi('project:projectLog:remove')}]];
  var exportFlag = [[${@permission.hasPermi('project:projectLog:edit')}]];
  var prefix = ctx + "project/projectLog";

  $(function () {
    var options = {
      url: prefix + "/logList/",
      createUrl: prefix + "/add",
      updateUrl: prefix + "/edit/{id}",
      detailUrl: prefix + "/detail/{id}",
      removeUrl: prefix + "/remove",
      exportUrl: prefix + "/export",
      importTemplateUrl : prefix + "/importTemplate",
      showSearch: false,
      showExport: false,
      modalName: "项目日志",
      columns: [{
        checkbox: true
      },
        {
          field: 'logId',
          title: '',
          visible: false
        },
        {
          field: 'projectName',
          title: '项目名称'
        },
        {
          field: 'userName',
          title: '记录人'
        },
        {
          field: 'logDate',
          title: '记录日期'
        },
        {
          field: 'logWeather',
          title: '天气情况'
        },
        {
          field: 'logProblem',
          title: '存在的问题',
          formatter: function(value, row, index) {
            return $.table.tooltip(value);
          }
        },
        {
          field: 'logWorkPlan',
          title: '明天的工作计划',
          formatter: function(value, row, index) {
            return $.table.tooltip(value);
          }
        },
        {
          title: '操作',
          align: 'center',
          formatter: function (value, row, index) {
            let actions = [];
            actions.push('<a class="btn btn-warning btn-xs" href="javascript:void(0)" onclick="logDetail(\'' + row.logId + '\')"><i class="fa fa-edit"></i>查看</a> ');
            actions.push('<a class="btn btn-danger btn-xs' + removeFlag + '" href="javascript:void(0)" onclick="$.operate.remove(\'' + row.logId + '\')"><i class="fa fa-remove"></i>删除</a>');
            return actions.join('');
          }
        }]
    };
    $.table.init(options);
  });

  function logDetail(logId) {
    const url = prefix + '/detail/'+logId;
    $.modal.openTab("日志详情", url);
  }

  function downloadTp(key) {
    //window.location.href = prefix + '/downloadTp?key=' + key;
    $.ajax({
      url: prefix + '/downloadTp',
      cache: false,
      contentType: false,
      processData: false,
      type: 'GET',
      success: function (result) {
        alert(JSON.stringify(result));
        if (result.code == web_status.SUCCESS) {
          $.modal.closeAll();
          $.modal.alertSuccess(result.msg);
        } else if (result.code == web_status.WARNING) {
          layer.close(index);
          $.modal.enable();
          $.modal.alertWarning(result.msg)
        } else {
          layer.close(index);
          $.modal.enable();
          $.modal.alertError(result.msg);
        }
      }
    });
  }

  function uploadData() {
    layer.open({
      type: 1,
      area: ['450px', '200px'],
      fix: false,
      //不固定
      maxmin: true,
      shade: 0.3,
      title: '上传日志数据',
      content: $('#contractTpl').html(),
      btn: ['<i class="fa fa-check"></i> 上传', '<i class="fa fa-remove"></i> 取消'],
      // 弹层外区域关闭
      shadeClose: true,
      btn1: function (index, layero) {
        var projectLogFile = layero.find('#projectLogFile').val();
        if (projectLogFile == '' || (!$.common.endWith(projectLogFile, '.xls') && !$.common.endWith(projectLogFile, '.xlsx'))) {
          $.modal.msgWarning("请选择后缀为 “xls”或“xlsx”的日志数据文件。");
          return false;
        }

        var index = layer.load(2, {shade: false});
        $.modal.disable();
        var formData = new FormData();
        formData.append("projectId", $('#projectId').val());
        formData.append("projectLogFile", $('#projectLogFile')[0].files[0]);

        $.ajax({
          url: prefix + '/uploadData',
          data: formData,
          cache: false,
          contentType: false,
          processData: false,
          type: 'POST',
          success: function (result) {
            if (result.code == web_status.SUCCESS) {
              $.modal.closeAll();
              $.modal.alertSuccess(result.msg);
              $.table.refresh();
            } else if (result.code == web_status.WARNING) {
              layer.close(index);
              $.modal.enable();
              $.modal.alertWarning(result.msg)
            } else {
              layer.close(index);
              $.modal.enable();
              $.modal.alertError(result.msg);
            }
          }
        });
      }
    });
  }
</script>
<!-- 导入区域 -->
<script id="contractTpl" type="text/template">
  <form enctype="multipart/form-data" class="mt20 mb10">
    <div class="col-xs-offset-1">
      <div class="form-group">
        <label class="col-sm-4 control-label">上传日志：</label>
        <div class="col-sm-8 control-label">
          <input id="projectLogFile" name="projectLogFile" type="file" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel">
        </div>
      </div>
      <div class="mt10 pt5">
        <a onclick="$.table.importTemplate()" class="btn btn-default btn-xs"><i class="fa fa-file-excel-o"></i> 下载模板</a>
      </div>
      <font color="red" class="pull-left mt10">
        提示：仅允许导入“xls”或“xlsx”格式文件！
      </font>
    </div>
  </form>
</script>
</body>
</html>